﻿<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<!-- Document Meta
    ============================================= -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!--IE Compatibility Meta-->
<meta name="author" content="zytheme" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="description" content="construction html5 template">
<link href="assets/images/favicon/favicon.ico" rel="icon">

<!-- Fonts
    ============================================= -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i%7CRaleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i%7CUbuntu:300,300i,400,400i,500,500i,700,700i' rel='stylesheet' type='text/css'>

<!-- Stylesheets
    ============================================= -->
<link href="assets/css/external.css" rel="stylesheet">
<link href="assets/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet">


<!-- HTML5 shim, for IE6-8 support of HTML5 elements. All other JS at the end of file. -->
<!--[if lt IE 9]>
      <script src="assets/js/html5shiv.js"></script>
      <script src="assets/js/respond.min.js"></script>
    <![endif]-->

<!-- Document Title
    ============================================= -->
<title>Autoshop | E-commerce Html5 Template</title>
</head>
<body>

     


<!-- Document Wrapper
	============================================= -->
<div id="wrapper" class="wrapper clearfix">
	
	<header id="navbar-spy" class="header header-1">
		<div class="top-bar">
			<div class="container">
				<div class="row">
					<div class="col-xs-12 col-sm-6 col-md-5">
						<ul class="list-inline top-contact">
							<li><span>Phone :</span> + 88888888888888</li>
							<li><span>Email :</span> 8888888888@qq.com</li>
						</ul>
					</div>
					<div class="col-xs-12 col-sm-6 col-md-7">
						<ul class="list-inline pull-right top-links">
							<li>
								<a href="#">Time :</a>
							</li>
							<li class="dropdown" id="timeId">
								
							</li>
						</ul>
					</div>
				</div>
				<!-- .row end -->
			</div>
			<!-- .container end -->
		</div>
		<nav id="primary-menu" class="navbar navbar-fixed-top">
			<div class="container">
	
				<!-- Brand and toggle get grouped for better mobile display -->
				<div class="navbar-header">
					<a class="logo" href="index.html">
					<img src="assets/images/logo/logo.jpg" alt="Autoshop" width="80px" height="80px">
					<img src="assets/images/logo/fontLogo.png" width="100px" height="40px" />
					</a>
				</div>
				<!-- Collect the nav links, forms, and other content for toggling -->
				<div class="collapse navbar-collapse pull-left" id="header-navbar-collapse-1" style="margin-left: 40px;">
					<ul class="nav navbar-nav navbar-left">
						<li class="has-dropdown">
							<a href="index.html" style="font-family: '微软雅黑'; font-size: 14px; color: #684029; font-weight: 500;">首页</a>
						</li>
						<!-- li end -->
						<li class="has-dropdown">
							<a href="dangao.html"  style="font-family: '微软雅黑'; font-size: 14px; color: #684029; font-weight: 500;">蛋糕</a>
						</li>
						<!-- li end -->
						<li>
							<a href="bingqiling.html" style="font-family: '微软雅黑'; font-size: 14px; color: #684029; font-weight: 500;" >冰淇淋</a>
						</li>
						<li class="has-dropdown">
							<a href="xiawucha.html" style="font-family: '微软雅黑'; font-size: 14px; color: #684029; font-weight: 500;" >咖啡下午茶</a>
						</li>
						<!-- li end -->
						<li class="has-dropdown pull-left">
							<a href="contact-1.html" style="font-family: '微软雅黑'; font-size: 14px; color: #684029; font-weight: 500;">联系我们</a>
						</li>
						<!-- li end -->
					</ul>
					
					
				</div>
				<div class="collapse navbar-collapse pull-right" id="header-navbar-collapse-1" style="margin-right: 20px;">
					<!-- Mod-->
					<div class="module module-search pull-left">
						<ul class="list-inline navbar-nav">
							<li style="margin-right: 0px"; >
								<a href="#" style="font-family: '微软雅黑'; font-size: 14px; color: #684029; font-weight: 500;"  onclick = "modaklogin()">登入</a>
								/
								<a href="#" style="font-family: '微软雅黑'; font-size: 14px; color: #684029; font-weight: 500;" onclick = "modalRegister()">注册</a>
							</li>
						</ul>
					</div>
					<!-- .module-search-->
					<!-- Mod-->
					<div class="module module-search pull-left" style="margin-right: 10px;">
						<div class="search-icon">
							<i class="fa fa-search"></i>
							<span class="title">search</span>
						</div>
						<div class="search-box">
							<form class="search-form">
								<div class="input-group">
									<input type="text" class="form-control" placeholder="输入您想要查找的内容">
									<span class="input-group-btn">
									<button class="btn" type="button"><i class="fa fa-search"></i></button>
									</span>
								</div>
								<!-- /input-group -->
							</form>
						</div> 
						
					</div>
					<!-- .module-search-->
					<!-- .module-cart -->
					<div class="module module-cart pull-left">
						<div class="cart-icon">
							<i class="fa fa-shopping-cart"></i>
							<span class="title">shop cart</span>
							<!--
                            	作者：offline
                            	时间：2018-05-03
                            	描述：
                            	<span class="cart-label">100</span>
                            -->
						</div>
						<div class="cart-box">
							<div class="cart-overview">
								<ul class="list-unstyled">
									<li>
										<img class="img-responsive" src="/images/shop/thumb/1.jpg" alt="product"/>
										<div class="product-meta">
											<h5 class="product-title">Belt Car Engine</h5>
											<p class="product-price">价格 : $68.00 </p>
											<p class="product-quantity">数量 : 2</p>
										</div>
										<a class="cancel" href="#">取消</a>
									</li>
									<li>
										<img class="img-responsive" src="/images/shop/thumb/2.jpg" alt="product"/>
										<div class="product-meta">
											<h5 class="product-title">OIL FILTER</h5>
											<p class="product-price">价格 : $180.00 </p>
											<p class="product-quantity">数量 : 1</p>
										</div>
										<a class="cancel" href="#">取消</a>
									</li>
								</ul>
							</div>
							<div class="cart-total">
								<div class="total-desc">
									<h5>总价 :</h5>
								</div>
								<div class="total-price">
									<h5>$316.00</h5>
								</div>
							</div>
							<div class="clearfix">
							</div>
							<div class="cart-control">
								<a class="btn btn-primary btn-block" href="shop-cart.html">支付</a>
								<a class="btn btn-secondary btn-block" href="#">清空</a>
							</div>
						</div>
					</div>
					<!-- .module-cart end -->
				</div>
				<!-- /.navbar-collapse -->
			</div>
			<!-- /.container-fluid -->
		</nav>
	</header>



	<section id="shopgrid" class="shop shop-single">
		<div class="container">
			<div class="row">
				<div class="col-xs-12 col-sm-12 col-md-9 shop-content">
					<!-- .aret end -->
					
					<!-- Product Image -->
					<div class="product-img product-feature-img mb-50">
						<img src="assets/images/product/qiancaobig.jpg" alt="product"/>
					</div>
					<!-- .product-img end -->
					
					<!-- Product Content -->
					<div class="product-content">
						<div class="product-title text-center-xs">
							<span style="font-family: '微软雅黑'; font-size: 18px; color: #684029; font-weight: 600;" >浅  草</span>
						</div>
						<!-- .product-img end -->
						
						<div class="product-meta mb-30">
							<div class="product-price pull-left pull-none-xs">
								<p><span class="discount">$220.00</span>$150.00</p>
							</div>
							<!-- .product-price end -->
							<div class="product-review text-right text-center-xs">
								<span class="product-rating">
								<i class="fa fa-star"></i>
								<i class="fa fa-star"></i>
								<i class="fa fa-star"></i>
								<i class="fa fa-star-half-o"></i>
								<i class="fa fa-star-o"></i>
								</span>
								<span>5 Review(s)</span> / <span>
								<a href="#">Add Review</a>
								</span>
							</div>
							<!--- .product-review end -->
						</div>
						<!-- .product-img end -->
						
						<div class="product-desc text-center-xs">
							<p>“浅草才能没马蹄”/切着吃的雨前西湖龙井//中国绿茶与爽脆果实，工笔勾勒一杯好茶//复杂而纯粹的深浅绿意/*本款为季节性产品，夹心层由南水梨/马蹄更替</p>
						</div>
						<hr class="mt-30 mb-30">
						<div class="product-action">
							<div class="product-quantity pull-left pull-none-xs">
								<span class="qua">数量:</span>
								<span>
								<a href="#"><i class="fa fa-minus"></i></a>
								<input type="text" value="2" id="pro-qunt" readonly>
								<a href="#"><i class="fa fa-plus"></i></a>
								</span>
							</div>
							<div class="product-cta text-right text-center-xs">
								<a class="btn btn-primary" href="#">加入购物车</a>
								<!--<a class="btn btn-primary bordered" href="#">取消</a>-->
							</div>
						</div>
						<!-- .product-action end -->
						<hr class="mt-30 mb-30">
						
						<div class="product-tabs">
							<!-- Nav tabs -->
							<ul class="nav nav-tabs" role="tablist">
								<li role="presentation" class="active">
									<a href="#details" aria-controls="details" role="tab" data-toggle="tab" style="font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 14px; color: #684029;"">详情</a>
								</li>
								<li role="presentation">
									<a href="#reviews" aria-controls="reviews" role="tab" data-toggle="tab" style="font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 14px; color: #684029;"">评论(2)</a>
								</li>
							</ul>
							
							<!-- Tab panes -->
							<div class="tab-content">
								<!-- #description end -->
								<div role="tabpanel" class="tab-pane active" id="details">
									<h5 style="font-family: '微软雅黑'; font-size: 18px; color: #684029; font-weight: 4;">商品详情</h5>
									<table class="table table-striped">
										<tbody>
											<tr>
												<td>尺寸:</td>
												<td>60-MCTE</td>
											</tr>
											<tr>
												<td>保险条件:</td>
												<td>0－4℃保藏10小时，5℃食用为佳</td>
											</tr>
											<tr>
												<td>甜度参考:</td>
												<td>2 分</td>
											</tr>
											<!--<tr>
												<td>Item model number</td>
												<td>60-MCTE</td>
											</tr>
											<tr>
												<td>Item Package Quantity</td>
												<td>1</td>
											</tr>
											<tr>
												<td>Number of Handles</td>
												<td>1</td>
											</tr>
											<tr>
												<td>Batteries Required?</td>
												<td>No</td>
											</tr>-->
										</tbody>
									</table>
								</div>
								<!-- #details end -->
								<div role="tabpanel" class="tab-pane reviews" id="reviews">
									<ul class="product-review list-unstyled">
										<li class="review-comment">
											<h6>网友xxx</h6>
											<p class="review-date">22/02/2018</p>
											<div class="product-rating">
												<i class="fa fa-star"></i>
												<i class="fa fa-star"></i>
												<i class="fa fa-star"></i>
												<i class="fa fa-star"></i>
												<i class="fa fa-star-half-o"></i>
											</div>
											<div class="product-comment">
												<p>美味好吃！！！！！！！</p>
											</div>
										</li>
										<!-- .review-comment end -->
										
										<li class="review-comment">
											<h6>网友xxx</h6>
											<p class="review-date">21/02/2018</p>
											<div class="product-rating">
												<i class="fa fa-star"></i>
												<i class="fa fa-star"></i>
												<i class="fa fa-star"></i>
												<i class="fa fa-star-o"></i>
												<i class="fa fa-star-o"></i>
											</div>
											<div class="product-comment">
												<p>巨好吃！！！1</p>
											</div>
										</li>
										<!-- .review-comment end -->
									</ul>
									<div class="form-review">
										<form>
											<input type="text" class="form-control" id="name" placeholder="Your Name"/>
											<input type="email" class="form-control" id="email" placeholder="Your Email"/>
											<textarea class="form-control" id="review" rows="2" placeholder="Review"></textarea>
											<button type="submit" class="btn btn-primary btn-black btn-block">提交</button>
										</form>
									</div>
								</div>
								<!-- #reviews end -->
							</div>
							<!-- #tab-content end -->
						</div>
						<!-- .product-tabs end -->
					</div>
					<!-- .product-content -->
					
				</div>
				<!-- .shop-content end -->
					<div class="col-xs-12 col-sm-12 col-md-3 sidebar">
						<!-- Categories
	============================================= -->
						<div class="widget widget-categories">
							<div class="widget-title">
								<span style="font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 16px; color: #482618;">分类</span>
							</div>
							<div class="widget-content">
								<ul class="list-unstyled">
									<li>
										<a href="#"><i class="fa fa-angle-double-right"></i>蛋糕<span>(5)</span></a>
									</li>
									<li>
										<a href="#"><i class="fa fa-angle-double-right"></i>冰淇淋<span>(77)</span></a>
									</li>
									<li>
										<a href="#"><i class="fa fa-angle-double-right"></i>咖啡下午茶<span>(6)</span></a>
									</li>
								</ul>
							</div>
						</div>
						<!-- .widget-categories end -->
						
						<!-- Recent Products
	============================================= -->
						<div class="widget widget-recent-products">
							<div class="widget-title">
								<span style="font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 16px; color: #482618;">热销商品</span>
							</div>
							<div class="widget-content">
						<!-- Product #1 -->
								<div class="product">
									<img src="assets/images/product/newProduct.png" width="60px" height="50px" alt="product"/>
									<div class="product-desc">
										<div class="product-title">
											<a href="#" style=" font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 14px; color: #684029;">浅草</a>
										</div>
										<div class="product-meta">
											<span class="color-theme">$13.99</span>
										</div>
									</div>
								</div>
								<!-- .recent-product end -->
								
								<!-- Product #2 -->
								<div class="product">
									<img src="assets/images/product/dangao7.jpg" width="60px" height="50px" alt="product"/>
									<div class="product-desc">
										<div class="product-title">
											<a href="#" style=" font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 14px; color: #684029;">枣儿</a>
										</div>
										<div class="product-meta">
											<span class="color-theme">$15.99</span>
										</div>
									</div>
								</div>
								<!-- .recent-product end -->
								
								<!-- Product #3 -->
								<div class="product">
									<img src="assets/images/product/dangao5.jpg" width="60px" height="50px" alt="product"/>
									<div class="product-desc">
										<div class="product-title">
											<a href="#" style=" font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 14px; color: #684029;">百利甜情人</a>
										</div>
										<div class="product-meta">
											<span class="color-theme">$11.99</span>
										</div>
									</div>
								</div>
							</div>
							<!-- .widget-content end -->
						</div>
						<!-- .widget-recent-product end -->											
						<!-- Select Brand
	============================================= -->
						<div class="widget widget-brands">
							<div class="widget-title">
								<span style="font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 16px; color: #482618;">多选</span>
							</div>
							<div class="widget-content">
								<form>
									<!-- Check #1 -->
									<div class="check-option">
										<input type="checkbox" class="checkbox-style" name="brands"   id="Opel" value="Opel">
										<label for="Opel" class="checkbox-label" >蛋糕 <span>(5)</span></label>
									</div>
									<!-- Check #2 -->
									<div class="check-option">
										<input type="checkbox" class="checkbox-style" name="brands"  id="Subaru" value="Subaru">
										<label for="Subaru" class="checkbox-label" >冰淇淋 <span>(77)</span></label>
									</div>
									<!-- Check #3 -->
									<div class="check-option">
										<input type="checkbox" class="checkbox-style" name="brands" id="BMW" value="BMW">
										<label for="BMW" class="checkbox-label" >下午茶 <span>(16)</span></label>
									</div>
				
								</form>
							</div>
						</div>
						<!-- .widget-brand end -->
						
						<!-- Recent Products
	============================================= -->
						

						<div class="widget widget-tags">
							<div class="widget-title">
								<span style="font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 16px; color: #482618;">标签</span>
							</div>
							<div class="widget-content">
								<a href="#">浅草</a>
								<a href="#">枣儿</a>
								<a href="#">芒果奶油蛋糕</a>
								<a href="#">榴莲飘飘</a>
								<a href="#">百香果酸奶酪慕斯</a>
								<a href="#">朗姆芝士</a>
								<a href="#">深爱百利甜情人蛋糕</a>
								<a href="#">布莱克</a>
								<a href="#">黑白巧克力慕斯</a>
								<a href="#">六口味切块</a>
							</div>
						</div>
						<!-- .widget-tags end -->
					</div>
					<!-- Categories
============================================= -->>
				
					<!-- .widget-tags end -->
				</div>
				<!-- .col-md-3 end -->
		</div>
		<!-- .container end -->
	</section>
	<!-- #blog end -->
	
	<!-- Footer #1
============================================= -->
	<footer id="footer" class="footer footer-2">
		<!-- Footer Info
	============================================= -->
		

		<!-- Footer Bar
	============================================= -->
		<div class="footer-bar">
				<div class="container">
					<div class="row">
						<div class="col-xs-12 col-sm-6 col-md-6">
							<div class="powered">
								<p>Car Shop &copy; All Rights Reserved. With Made With Love By
									<a>7oroof.com</a>
								</p>
								<ul class="list-inline mb-0">
									<li>
										<a href="#">Privacy Policy</a>
									</li>
									<li>
										<a href="#">Terms of Use</a>
									</li>
									<li>
										<a href="#">Stores</a>
									</li>
									<li>
										<a href="#">About Us</a>
									</li>
								</ul>
							</div>
						</div>
						<div class="col-xs-12 col-sm-6 col-md-6">
							<div class="payment-methods text-right">
								<ul class="list-inline mb-0">
									<li><img src="assets/images/footer/visa.png" alt="payment"></li>
									<li><img src="assets/images/footer/mastercard.png" alt="payment"></li>
									<li><img src="assets/images/footer/american-express.png" alt="payment"></li>
									<li><img src="assets/images/footer/delta.png" alt="payment"></li>
									<li><img src="assets/images/footer/cirrus.png" alt="payment"></li>
									<li><img src="assets/images/footer/paypal.png" alt="payment"></li>
								</ul>
							</div>
						</div>
					</div>
				</div>
				<!-- .container end -->
			</div>
		<!-- .footer-copyright end -->
	</footer>
</div>
<!-- #wrapper end -->

<!-- Footer Scripts
============================================= -->
<script src="assets/js/jquery-2.2.4.min.js"></script>
<script src="assets/js/plugins.js"></script>
<script src="assets/js/functions.js"></script>
</body>
</html>
